import React from 'react'
import { Button, Input, Checkbox, Form, Upload, Modal, Icon } from 'antd'
const FormItem = Form.Item

function info () {
  Modal.info({
    title: 'This is a temporary show for terms and statement',
    okText: 'ok',
    content: (
      <div>
        <p>some messages...some messages...</p>
        <p>some messages...some messages...</p>
      </div>
    ),
    onOk () {}
  })
}

class App extends React.Component {
  constructor (props) {
    super(props)
    this.state = {

    }
  }
  download (fileCode) {
    T.ajax({
      url: '/proxy/api/uc/channel/licenseFile?fileCode=' + fileCode,
      data: {}
    })
  }

  render () {
    const {getFieldDecorator, backToPrev, submitData, fileProps1, handleConfirmBlur, fileName} = this.props

    return <div>
      <div className='clearfix itemWrap'>
        <FormItem className='inputItem'>
          <p>Registration No.</p>
          {getFieldDecorator('businessLicense', {
            rules: [{ required: true, message: 'Please enter number' }],
            initialValue: submitData && submitData.businessLicense
          })(
            <Input
              placeholder='Please enter'
              onBlur={handleConfirmBlur}
              maxLength={'64'} />
          )}
        </FormItem>
      </div>
      <div className='clearfix itemWrap'>
        <p className='tal fc3 mb20'>
          <span>Upload business license</span>
          <a className='aLink'>
            <span className='circleIcon ml20 mr10 fcw'>
              ?
            </span>
              What’s this?
            <img className='sample-img' src='/assets/images/sample.png' />
          </a>
        </p>

        <FormItem className='inputItem'>
          {getFieldDecorator('licenseFile', {
            initialValue: submitData && submitData.licenseFile
          })(
            <Upload
              {...fileProps1}
            >
              <Button>
                <Icon type='upload' /> Select a file
              </Button>
            </Upload>
          )}
          {fileName &&
            <a className='mt20'>{fileName}</a>
          }
          {!fileName &&
            submitData.licenseFileCode &&
            <a href={'ajax/proxy/api/uc/channel/licenseFile?fileCode=' + submitData.licenseFileCode} target='_blank' className='mt20 cursor-pointer'>{submitData.licenseFileName}</a>
          }
          <p className='mt20'>Supported file formats: doc, docx, pdf, jpg, png. 10M limited</p>
        </FormItem>
      </div>
      <div className='clearfix itemWrap'>
        <FormItem className='inputItem clearfix mt25 mb35 '>
          {getFieldDecorator('agree', {
            valuePropName: 'checked',
            initialValue: true
          })(
            <Checkbox className='fl f12 mb10'>
            I agree with
            </Checkbox>
          )}
          <a className='diy_color fl f12 mr10' onClick={info}>Terms of Service</a> <span className='fl f12'>and</span><a className='diy_color fl f12 ml10' onClick={info}> Privacy Statement</a>
        </FormItem>
      </div>
      <div className='clearfix itemWrap'>
        <FormItem className='inputItem'>
          <Button className='tinyBtn' onClick={backToPrev}>Back</Button>
          <Button type='primary' className='tinyBtn ml20' htmlType='submit'>Submit</Button>
        </FormItem>
      </div>
    </div>
  }
}

export default App
